<template name='xxlb'>
  <view class="">
      <u-sticky>
          <view class="box">
              <view class="liubai">

              </view>
              <view class="title">
                  消息列表
              </view>
          </view>

      </u-sticky>
    <view class="flex-col group_1">
        <view class="" style="text-align: center;margin-top: 50rpx;" v-if="list_fPE9fjR9.length==0">
            <image src="../../static/zixun.png" mode="scaleToFill" style="margin-top: 100rpx;width: 150rpx;height: 140rpx;"></image>
            <view class="" style="color: #999;font-size: 28rpx;margin-top: 20rpx;">
                暂无消息
            </view>
        </view>
      <view class="flex-col list">
        <view class="flex-col list-item" :key="i" v-for="(item, i) in list_fPE9fjR9" @click="click23(item)">
          <view class="flex-col items-center text-wrapper"><text class="text_1">{{item.createTime}}</text></view>
          <view class="flex-col section_1">
            <view class="flex-row group_3">
              <image
                src="https://project-user-resource-1256085488.cos.ap-guangzhou.myqcloud.com/62ac1d455a7e3f03100b6468/62b188edd029820011534ee0/16558038219320939635.png"
                class="image_2"
              />
              <text class="text_3">{{ item.state == 0 ? '服务通知' : item.state == 1 ? '系统通知' : '收入通知'}}</text>
            </view>
            <text class="text_5" v-if="item.title!=null">{{ item.title }}</text>
            <text class="text_7" v-if="item.state == 0">{{ '用户' + [(item.nickname ? item.nickname : '用户已注销')] + '向您发出提问[' + item.message + ']' }}</text>
            <text class="text_7" v-if="item.state != 0">{{ item.message }}</text>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import {getMessageList} from '../../api/api.js'
  export default {
      name: 'xxlb',
      props: {
      	cur: String,
      },
    components: {},
    data() {
      return {
        pageInfo: {
          pageIndex: 1,
          pageSize: 10
        },
        list_fPE9fjR9: [],
      };
    },
    created() {
      this.getMessageList()
    },
    mounted() {
      uni.$on('Bottom',()=>{
        this.pageInfo.pageIndex += 1
        setTimeout(() => {
          this.getMessageList()
        }, 500)
      })
    },
    methods: {
      getMessageList() {
        getMessageList(this.$store.state.userInfo.wxInfo.uid, this.pageInfo).then(res => {
          this.list_fPE9fjR9 = this.list_fPE9fjR9.concat(res.data.list)
          console.log('this.list_fPE9fjR9', this.list_fPE9fjR9)
        })
      },
      click23(item){
          uni.navigateTo({
              url:'/pages/huaban_1_kaobei_23/huaban_1_kaobei_23?item='+encodeURIComponent(JSON.stringify(item))
          })
      }
    },
  };
</script>

<style scoped lang="css">
    .box{
        background-color: #6D79FE;
        text-align: center;
    }
    .liubai{
         height: var(--status-bar-height);
        width: 100%;
    }
    .title{
       color: #fff;
       padding: 15rpx 0 ;
    }
  .list-item {
    margin-top: 1.91rem;
  }
  .image_6 {
    width: 1.69rem;
    height: 1.69rem;
  }
  .text-wrapper {
    padding: 0.34rem 12px 0.31rem;
    align-self: center;
    background-color: #d8d9e2;
    border-radius: 0.59rem;
  }
  .section_1 {
    margin-top: 0.53rem;
    padding: 0 0.81rem 1.19rem 0.94rem;
    background-color: #ffffff;
    border-radius: 0.47rem;
  }
  .text_1 {
    color: #ffffff;
    font-size: 0.69rem;
    font-family: SourceHanSansCN;
    line-height: 0.53rem;
  }
  .group_3 {
    padding: 0.78rem 0.063rem 0.75rem;
    border-bottom: solid 0.031rem #e5e5e5;
  }
  .text_5 {
    margin-top: 0.94rem;
    align-self: flex-start;
    color: #333333;
    font-size: 1rem;
    font-family: SourceHanSansCN;
    font-weight: 500;
    line-height: 0.94rem;
  }
  .text_7 {
    margin-top: 0.63rem;
    color: #999999;
    font-size: 0.88rem;
    font-family: SourceHanSansCN;
    line-height: 0.84rem;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
  .image_2 {
    width: 1.34rem;
    height: 1.34rem;
  }
  .text_3 {
    margin: 0.22rem 0 0.19rem 0.38rem;
    color: #333333;
    font-size: 1rem;
    font-family: SourceHanSansCN;
    font-weight: 500;
    line-height: 0.94rem;
  }
  .page {
    background-color: #f5f5f5;
    border-bottom: solid 0.28rem #ffffff;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100%;
  }
  .group_1 {
    flex: 1 1 auto;
    overflow-y: auto;
    height: 84vh;
    background-color: #f7f4f8;
  }
  .tab-bar {
    padding: 0.22rem 1.78rem 0.34rem;
    background-color: #ffffff;
    box-shadow: 0px 0.13rem 2.13rem #7d7d7d3d;
  }
  .list {
    padding: 0 0.94rem;
  }
  .group_6 {
    width: 2.5rem;
    height: 2.47rem;
  }
  .group_7 {
    height: 2.44rem;
  }
  .group_8 {
    margin-top: 0.078rem;
    height: 2.39rem;
  }
  .group_9 {
    margin-right: 0.13rem;
    margin-top: 0.094rem;
    height: 2.38rem;
  }
  .group_2 {
    margin-top: initial;
  }
  .text_17 {
    margin-top: 0.19rem;
    color: #9dabc0;
    font-size: 0.63rem;
    font-family: SourceHanSansCN;
    line-height: 0.59rem;
  }
  .text_18 {
    margin-top: 0.16rem;
    color: #9dabc0;
    font-size: 0.63rem;
    font-family: SourceHanSansCN;
    line-height: 0.59rem;
  }
  .text_19 {
    margin-top: 0.11rem;
    color: #6d79fe;
    font-size: 0.63rem;
    font-family: SourceHanSansCN;
    line-height: 0.59rem;
  }
  .text_20 {
    margin-top: 0.094rem;
    color: #9dabc0;
    font-size: 0.63rem;
    font-family: SourceHanSansCN;
    line-height: 0.59rem;
  }
</style>
